<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>项目案例</title>
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="../../css/common.css">
    <link rel="stylesheet" href="../../css/swiper.min.css">
    <script src="../../js/swiper.min.js"></script>
    <!-- 引入 animate.css  -->
    <link href="https://cdn.bootcss.com/animate.css/3.7.2/animate.css" rel="stylesheet">
    <!-- 引入 wow .js  -->
    <script src="https://cdn.bootcss.com/wow/1.1.2/wow.js"></script>
    <script src="../../js/jquery-3.4.1.min.js"></script>

</head>

<body>
    <div class="header">
        <div class="header-c">
            <a class="logo wow slideInDown" href="#">
                <img src="../../img/logo.png" alt="">
            </a>
            <ul class="lost wow slideInDown">
                <li><a href="../../index.html">首页</a></li>
                <li class="active"><a href="../project/index.html">项目案例</a></li>
                <li><a href="../join/index.html">加入我们</a></li>
                <li><a href="../contect/index.html">联系我们</a></li>
            </ul>

            <!-- 手机端 -->
            <a class="line" href="javascript:;">
                <span></span>
                <span></span>
                <span></span>
            </a>

            <div class="mido wow slideInDown">
                <p><a href="../../index.html">首页</a></p>
                <p><a href="../project/index.html">项目案例</a></p>
                <p><a href="../join/index.html">加入我们</a></p>
                <p><a href="../contect/index.html">联系我们</a></p>
            </div>
        </div>
    </div>
    <div class="banner">
        <div class="banner-c">
            <h1 class="wow slideInUp">项目案例介绍</h1>
            <h2 class="wow slideInUp">Effective case</h2>
        </div>
    </div>


    <div class="main container">
        <ul class="text case-pagination">
            <li class="wow slideInUp active"><a href="javascript:;">全部</a></li>
            <li class="wow slideInUp"><a href="javascript:;">网站</a></li>
            <li class="wow slideInUp"><a href="javascript:;">小程序</a></li>
            <li class="wow slideInUp"><a href="javascript:;">APP</a></li>
        </ul>
        <div class="box case-swiper">
            <div class="swiper-wrapper">
                <ul class="pict swiper-slide">
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                </ul>
                <ul class="pict swiper-slide">
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                </ul>
                <ul class="pict swiper-slide">
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                </ul>
                <ul class="pict swiper-slide">
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                    <li class="wow slideInUp">
                        <a class="pian" href="#">
                            <img src="img/east.png" alt="">
                        </a>
                        <a class="last" href="#">
                            <p class="poto">马克叔叔摄影网站</p>
                            <p class="spo">摄影摄像行业</p>
                        </a>
                    </li>
                </ul>
            </div>
        </div>

    </div>



    <div class="foot">
        <img class="bgc" src="../../img/foot.png" alt="">
        <div class="foot-c">
            <div class="talk wow fadeInUp">
                <span class="wec">联系我们</span>
                <span class="wee">Contact Us</span>
            </div>

            <div class="come">
                <div class="compy wow fadeInUp">
                    <img src="../../img/bufanwhite.png" alt="">
                    <p>郑州不凡科技有限公司</p>
                </div>

                <ul class="wow fadeInUp">
                    <li>地址：郑东新区绿地新都会6号楼1210</li>
                    <li>电话：0371-55602883</li>
                    <li>手机：18838180363</li>
                </ul>
                <ul class="rode wow fadeInUp">
                    <li>路线：地铁1号线 东风南路站C口出向北步行300米(近郑州东站)</li>
                    <li>郵编：450000</li>
                    <li>邮箱：bd@bufanui.com</li>
                </ul>
            </div>
        </div>
    </div>


    <div class="final">
        <img src="../../img/last.png" alt="">
        <div class="final-c">
            <p class="wow fadeInUp">©2017不凡科技 郑州IT技术服务 豫ICP备17015347号</p>
        </div>
    </div>
    <script src="../../js/common.js"></script>
    <script>
        // 初始化 wow.js 
        new WOW().init();
        var mySwiper0 = new Swiper('.container', {

            // loop: true, // 循环模式选项

            // 如果需要前进后退按钮
            // navigation: {
            //     nextEl: '.right.swiper-button-next',
            //     prevEl: '.left.swiper-button-prev',
            // },
        })


        var mySwiper2 = new Swiper('.case-swiper', {
            // spaceBetween: 0,
            loop: true,
            pagination: {
                el: '.case-pagination',
                type: 'custom',
                renderCustom: function (swiper, current, total) {
                    
                    $(this.el).children().eq(current - 1).addClass('active').siblings().removeClass('active');
                    $(this.el).on('click', 'li', function () {
                        
                        swiper.slideTo($(this).index() + 1);
                    });
                }
            },
        })
        

    </script>
</body>

</html>